<template>
	<view class="template bg-gray1" style="min-height: 100vh;">
		<cu-custom :bgColor="'bg-'+theme.backgroundColor" :isBack="false" :isContainer="false">
			<block slot="content">
				<text v-if="currentTab == 1">{{pageName || '活动'}}</text>
				<text v-else-if="currentTab == 2">我的</text>
				<text v-else>云仓活动</text>
			</block>
		</cu-custom>
		<view>
			<button type="default" v-if="userInfo&&!userInfo.phone" @click="openLogin()" class="l_btn">登录</button>
			<view class="cu-load" v-if="userInfo&&userInfo.phone&&userInfo.userType!=3">暂无内容</view>
		</view>
		<!-- 活动列表 -->
		<view class="bg-white" style="padding: 20rpx 30rpx 0rpx;" v-if="currentTab==1&&actRange&&actRange.length">
			<view class="top_picker">
				<picker mode="selector" :range="actRange" :value="currentAct" range-key='activityName' @change="actSelect">
					{{currentActName || "+ 请选择活动"}}
				</picker>
			</view>
		</view>
		<view class="">
			<!-- 活动页面 -->
			<view v-if="currentTab==1&&activityId">
				<yc-active-pages :actId="activityId"></yc-active-pages>
			</view>
			<!-- 我的订单 -->
			<view v-if="currentTab==2">
				<yc-my-center ref="ycMyCenter"></yc-my-center>
			</view>
		</view>
		<view class="" style="height: 100rpx;"></view>
		<view class="b_bar" v-if="currentTab&&activityId">
			<view class="flex-sub text-center" :class="currentTab==1 ? 't_active' : ''" @click="currentTab=1"
				v-if="activityId">
				<view class="cuIcon-homefill" style="font-size: 54rpx;"></view>
				<view class="">首页</view>
			</view>
			<view class="flex-sub text-center" :class="currentTab==2 ? 't_active' : ''" @click="currentTab=2">
				<view class="cuIcon-emoji" style="font-size: 54rpx;"></view>
				<view class="">我的</view>
			</view>
		</view>
		<login-pop ref="lPop"></login-pop>
	</view>
</template>

<script>
	const util = require("utils/util.js");
	const app = getApp();
	import api from '@/utils/api'

	import ycActivePages from './children/yc-activePages.vue'
	import ycMyCenter from './children/yc-myCenter.vue'
	import loginPop from '@/components/login-pop/login-pop.vue'

	export default {
		name: 'act-yc',
		data() {
			return {
				theme: app.globalData.theme, //全局颜色变量
				CustomBar: this.CustomBar,
				pageName: '',
				activityId: '',
				currentTab: null, // 1 首页、2 我的订单 
				userInfo: null,
				currentActName: '', // 当前活动
				currentAct: 0, // 当前活动排序
				actRange: [], // 活动列表
			}
		},
		components: {
			ycActivePages,
			ycMyCenter,
			loginPop
		},
		onLoad(options) {
			app.initPage('yc').then(res => {
				app.checkLogin('yc').then(res => {
					this.userInfo = uni.getStorageSync('user_info') || {}
					this.getActList(options) // 获取活动列表					
				}).catch((err) => {
					if (err == 'userInfo') {
						this.userInfo = uni.getStorageSync('user_info') || {}
					} else {
						this.openLogin()
					}
				})
			})
		},
		onReachBottom() {
			if (this.$refs.ycMyCenter) {
				this.$refs.ycMyCenter.reachBottom()
			}
		},
		methods: {
			// 获取活动列表
			getActList(options) {
				api.ycMyActivity({
					userId: this.userInfo.userEmpId,
					status: 1
				}).then(res => {
					this.actRange = res.data || []
					if (this.actRange && this.actRange.length) {
						this.currentTab = 1
						const actId = options.activityId ? options.activityId : options.scene ? options.scene : ''
						if (actId) {
							let oArr = this.actRange.filter((v,i) => {
								if(v.id == actId) {
									this.currentAct = i 
									return v
								}
							})
							if (oArr && oArr.length) {
								this.currentActName = oArr[0].activityName
								uni.setStorageSync('yc_actName',this.currentActName)
								this.activityId = oArr[0].id
							} else {
								uni.showModal({
									title: '提示', //提示的标题
									content: '权限不足，请选择其他活动', //提示的内容
									showCancel: false, // 是否显示取消按钮，默认为 true
									success: (res) => {
										this.activityId = 1
									}
								});
							}
						} else {
							this.currentActName = this.actRange[0].activityName
							uni.setStorageSync('yc_actName',this.currentActName)
							this.activityId = this.actRange[0].id
						}
					} else {
						util.uShowModal('抱歉，账号权限不足，无法浏览活动')
						this.currentTab = 2
					}
				})
			},
			loadData() {
				api.getActiveByid(this.activityId).then(res => {
					this.pageName = res.data.activityName
				})
			},
			// 打开 -- 登录弹窗
			openLogin() {
				this.$refs.lPop.open('/pages/actYc/act-yc?activityId=' + this.activityId)
			},
			// 获取用户信息
			reLoadUser() {
				api.userInfoGet().then(res => {
					if (res.data) {
						this.userInfo = res.data
						uni.setStorageSync('user_info', this.userInfo)
						this.$refs.ycMyCenter.reLoadUser()
					}
				})
			},
			// 切换活动
			actSelect(e) {
				let index = e.detail.value
				this.currentActName = this.actRange[index].activityName
				uni.setStorageSync('yc_actName',this.currentActName)
				this.activityId = this.actRange[index].id
				this.currentAct = index
			}
		}
	}
</script>

<style scoped>
	.b_bar {
		position: fixed;
		bottom: 0;
		height: 99rpx;
		width: 100%;
		display: flex;
		align-items: center;
		background-color: #fff;
		border-top: 1rpx solid #d8d8d8;
		color: #8590A2;
		z-index: 99;
	}

	.b_bar .t_active {
		color: #FF4A6E;
	}

	.l_btn {
		width: 30%;
		background-image: linear-gradient(#FF3F6D, #FD8CA8);
		font-size: 30rpx;
		color: #fff;
		position: fixed;
		bottom: 160rpx;
		left: 35%;
	}

	.top_picker {
		background-color: #fff;
		padding: 20rpx 20rpx;
		border: 1rpx solid #ebebeb;
		border-radius: 15rpx;
		box-shadow: 0px 2rpx 2rpx #e5e5e5;
		font-size: 30rpx;
		text-align: center;
		color: #000;
		font-weight: 700;
	}
</style>